<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib uri="/resource/UserPwoer.tld" prefix="pwoer"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
	pageContext.setAttribute("fnId", request.getAttribute("fnId"));
	pageContext.setAttribute("userPwoer", request.getSession().getAttribute("userPwoer"));
%>
<c:set var="path" value="${pageContext.request.contextPath }" />
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!--[if lt IE 9]>
<script type="text/javascript" src="${path }/resource/plugin/hui/lib/html5.js"></script>
<script type="text/javascript" src="${path }/resource/plugin/hui/lib/respond.min.js"></script>
<script type="text/javascript" src="${path }/resource/plugin/hui/lib/PIE_IE678.js"></script>
<![endif]-->

<!-- 本框架基本脚本和样式 -->
<link href="${path }/resource/plugin/hui/skin/default/skin.css" rel="stylesheet"
	type="text/css" id="skin" />
<script type="text/javascript" src="${path }/resource/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="${path }/resource/js/systools/EXBase.js"></script>

<!-- 界面单独引入的其他样式和脚本 -->
<link rel="stylesheet"
	href="${path }/resource/plugin/hui/lib/zTree/v3/css/zTreeStyle/zTreeStyle.css"
	type="text/css">
<script type="text/javascript"
	src="${path }/resource/plugin/hui/lib/zTree/v3/js/jquery.ztree.core-3.5.js"></script>

<!-- 自定义css和js -->
<link href="${path }/resource/css/treeLayout.css" rel="stylesheet" type="text/css">

<!--[if IE 6]>
<script type="text/javascript" src="http://lib.h-ui.net/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>

<![endif]-->
<title>类型列表</title>
</head>
<body style="height: 100%; overflow: hidden;">

	<nav class="breadcrumb">
		<i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span>门户管理
		<span class="c-gray en">&gt;</span> 文章类型管理 <a
			class="btn btn-success radius r mr-20 size-S" 
			style="line-height: 1.6em; margin-top: 3px"
			href="javascript:location.replace(location.href);" title="刷新"><i
			class="Hui-iconfont">&#xe68f;</i></a>
	</nav>
	<div class="panal-l">
		<div class="pd-10" style="overflow: hidden;">
			<span class="f-l f-18">列表</span> 
			<pwoer:btn   value="add"  >
				<a class="f-r" onclick="openForm()"><i
				class="fa fa-plus c-success"></i> 添加类型</a>
				</pwoer:btn>
		</div>
		
		<div class="zTreeDemoBackground left">
			<ul id="treeDemo" class="ztree"></ul>
		</div>

	</div>

	<div class=" panal-r ">
	
		<form style="display: none;"  class="form form-horizontal responsive dataform" action="admin/articleCate/addOrModify"
			id="dataform">
			<legend>类型编辑</legend>
			<input type="hidden" name="id" id="functionId">
			<div class="row cl">
			<label class="form-label col-1">父级类型</label>
			<div class="formControls col-3">
				<select class="select select-box" size="1" name="parentId" id="parentId">
				</select>
			</div>
			<div class="col-1">
				<span class="Validform_checktip"></span>
			</div>
			<label class="form-label col-1">类型名称</label>
				<div class="formControls col-3">
					<input id="name" type="text" name="name" class="input-text " ignore="ignore"
						datatype="*1-50" nullmsg="类型名称不能为空">
				</div>
				<div class="col-1">
					<span class="Validform_checktip"></span>
				</div>
		</div>
			<div class="row cl">
				<label class="form-label col-1">类型图标</label>
				<div class="formControls col-3">
					<input datatype="*1-50" id="iconText" name="icon" nullmsg="类型名称不能为空"  ignore="ignore"
						type="text" class="input-text " 
						onclick="showIcon()" readonly="readonly" />
				</div>
				<div class="col-1">
					<span class="Validform_checktip"></span>
				</div>
				<label class="form-label col-1">描述</label>
				<div class="formControls col-3">
					<input name="description" id="description" datatype="*0-50" type="text"  ignore="ignore"
						class="input-text " value="" />
				</div>
				<div class="col-1">
					<span class="Validform_checktip"></span>
				</div>
			</div>
			<div class="row cl">
			<label class="form-label col-1">排序</label>
			<div class="formControls col-3">
				<input datatype="n" name="orderby" type="text" id="orderby"  ignore="ignore" class="input-text " value="" />
			</div>
			<div class="col-1">
				<span class="Validform_checktip"></span>
			</div>
			
		</div>
			<div class="row cl mt-40" >
				<div class="col-12 text-c">
				<pwoer:btn   value="edit"  >
					<a class="btn btn-success radius" onclick="updateFunction()" >保存</a>
					</pwoer:btn>
					<pwoer:btn   value="del"  >
					<a class="btn btn-danger  radius" onclick="delFunction()" >删除</a>
					</pwoer:btn>				
				</div>
			</div>
		</form>
	</div>
	<script type="text/javascript">
	var Huiform = null;
	$(function() {
		initFunctionList();
		Huiform = $(".dataform").Validform({
			tiptype : 2,
		});
	});

	/**
	 * 初始化类型列表
	 */
	function initFunctionSelected(id) {
		$.AjaxProxy({
			a : false,
			c : false
		}).invoke("admin/articleCate/all", function(loj) {
			$("#parentId").createSelectTree(loj.attr("result").dataList, {
				append : false,
				defaultValue:id
			});
		});

	}
	
	function initFunctionList() {
		var zNodes = new Array();
		$.AjaxProxy().invoke(
				"admin/articleCate/all",
				function(loj) {
					for (var i = 0; i < loj.getRowCount(); i++) {
						zNodes[i] = createNode(loj.getString(i, "id"), loj
								.getString(i, "parentId"), loj.getString(i, "name"));
					}
					initTree(zNodes);
				});
	}

	function updateFunction() {
		EXForm.initForm({refresh:function(){
			location.replace(location.href);
		}});
		EXForm.submit();
		$("#dataform").hide();
	}

	function initTree(zNodes) {
		var setting = {
			view : {
				dblClickExpand : false,
				showLine : false,
				selectedMulti : false
			},
			data : {
				simpleData : {
					enable : true,
					idKey : "id",
					pIdKey : "pId",
					rootPId : ""
				}
			},
			callback : {
				onClick : zTreeOnClick
			}
		};
		$.fn.zTree.init($("#treeDemo"), setting, zNodes);
	}

	// 点击加载节点信息
	function zTreeOnClick(event, treeId, treeNode) {
		$("#dataform").show();
		$.AjaxProxy({
			p:{id : treeNode.id },
			a : false,
			c : true
		}).invoke(
				"admin/articleCate/findById",
				function(loj) {
					// 初始化类型基本信息
					initFunctionSelected(loj.getString( 0, "parentId"));
					$("#functionId").val(loj.getString( 0, "id"));
					$("#name").val(loj.getString( 0, "name"));
					$("#iconText").val(loj.getString( 0, "icon"));
					$("#orderby").val(loj.getString( 0, "orderby"));
					$("#description").val(loj.getString( 0, "description"));
				});
	};

	function createNode(id, parentId, name) {
		var o = new Object();
		o.id = id;
		o.pId = parentId;
		o.name = name;
		return o;
	}
	function showIcon() {
		layer.open({
			type : 2,
			title : "选择图标",
			area : [ '80%', '80%' ],
			fix : true, // 不固定
			maxmin : true,
			content : '${path}/common/redirect/icons'
		});
	}

	function delFunction() {
		var id = $("#functionId").val();
		if (id != null && id != '') {
			layer.confirm('删除类型时会删除该类型的所有子类型！', {
				icon : 3,
				title : '提示'
			}, function(index) {
				layer.close(index);
				if($("#parentId").find("option:selected").text()=="| ROOT"){
					layer.alert("ROOT节点不能被删除",{icon:2});
					return false;
				}
				var id = $("#functionId").val();
				$.AjaxProxy({
					p : {keys: id }
				}).invoke("admin/articleCate/del", function(loj) {
					layer.alert('删除成功！', {
						icon : 1
					}, function(index) {
						$("#dataform").hide();
						layer.close(index);
						initFunctionList();
					});
					return false;
				});
			});
		} else {
			layer.alert("请先选中要删除的类型！");
		}
	}

	function openForm() {
		layer.open({
			type : 2,
			title : "新增类型",
			area : [ EXUI.SIZE_L, '400px' ],
			fix : true, // 不固定
			scrollbar : true,
			maxmin : true,
			content : '${path}/admin/articleCate/editForm'
		});
	}

	
	
	
	</script>
</body>
</html>